<template>
  <el-dialog title='系统用户,登录名&密码设置，密码默认是:wf123456' v-model="pd.open" width="500px" append-to-body>
    <el-form ref="userLoginNameRef" :model="pd.form" :rules="pd.rules" label-width="80px">

      <el-row>
        <el-col :span="12">
          <el-form-item label="登录账户" prop="loginName">
            <el-input v-model="pd.form.loginName" placeholder="请输入名称"/>
          </el-form-item>
          <el-form-item label="用户名称" prop="userName">
            <el-input disabled v-model="pd.form.userName" placeholder="请输入名称"/>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="用户密码" prop="password">
            <el-input v-model="pd.form.password" placeholder="请输入用户密码"/>
          </el-form-item>
          <el-form-item label="确认密码" prop="pwd">
            <el-input v-model="pd.form.pwd" placeholder="请输入确认密码"/>
          </el-form-item>
        </el-col>
      </el-row>

    </el-form>

    <template #footer>
      <div class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button type="info" @click="pd.open = false">关 闭</el-button>
      </div>
    </template>
  </el-dialog>
</template>
<script setup name="UserLoginName">
import {editLoginName} from "@/api/hrp/user";
import {getCurrentInstance, reactive} from "vue";
const {proxy} = getCurrentInstance();


const pd = reactive({
  open: false,
  form: {},
  rules: {
    loginName: [{required: true, message: "用户名称不能为空", trigger: "blur"}, {
      min: 2, max: 20, message: "用户名称长度必须介于 2 和 20 之间", trigger: "blur"
    }],
    password: [{required: true, message: "用户密码不能为空", trigger: "blur"}, {
      min: 5, max: 20, message: "用户密码长度必须介于 5 和 20 之间", trigger: "blur"
    }],
    pwd: [{required: true, message: "用户密码不能为空", trigger: "blur"}, {
      min: 5, max: 20, message: "用户密码长度必须介于 5 和 20 之间", trigger: "blur"
    }]
  }
});


// 新增
function edit(user) {
  reset();
  //合并
  if (!user.userId) {
    proxy.$modal.msgSuccess("用户id不能为空！！！");
    return;
  }
  pd.open = true;
  pd.form = {...pd.form, ...user}
  pd.form.password = 'wf123456';
  pd.form.pwd = 'wf123456';
}

// 表单重置
function reset() {
  pd.form = {
    userId: undefined,
    loginName: undefined,
    userName: undefined,
    password: undefined,
    isSys: "0"
  };
  pd.title = "";
  proxy.resetForm("userLoginNameRef");
}

/** 提交按钮 */
function submitForm() {
  proxy.$refs["userLoginNameRef"].validate(valid => {
    if (valid) {
      if (pd.form.password === pd.form.pwd) {
        editLoginName(pd.form).then(res => {
          proxy.$modal.msgSuccess(res.msg);
          pd.open = false;
        });
      }else {
        proxy.$modal.msgSuccess("两次密码不一样！！！");
      }
    }
  });
}



defineExpose({edit});
</script>

<style scoped>

</style>